1
00:00:00,750 --> 00:00:01,700
Hello and welcome.

2
00:00:01,710 --> 00:00:11,020
In this lecture we are going to create the functionality for our IRS news feed using javascript.

3
00:00:13,360 --> 00:00:23,110
I have attached the javascript to our history AML files so if you open up the demo file I have attached

4
00:00:23,230 --> 00:00:31,440
the script for this project to make it to make the news feed properly.

5
00:00:31,630 --> 00:00:40,420
So this script I've had ideas from line 19 to line 27 so write out and create a separate script and

6
00:00:40,420 --> 00:00:41,110
reference it.

7
00:00:41,110 --> 00:00:42,940
I am actually attached to it.

8
00:00:43,060 --> 00:00:50,470
If you notice have attached the script sharps before the close in body tag or right.

9
00:00:50,650 --> 00:00:55,750
Thus the beginning of the script here on line 19 and that's the end on line 27.

10
00:00:55,750 --> 00:01:03,430
The reason you attach this script to the close embodied just before the closing body tag is that it

11
00:01:03,520 --> 00:01:10,470
enables all the other content on the page to load before discrete is executed right.

12
00:01:10,690 --> 00:01:15,430
So line 19 is defines the opening script inside.

13
00:01:15,430 --> 00:01:21,530
I've got an attribute called type and the value is test slash javascript.

14
00:01:21,670 --> 00:01:23,620
That attribute is not necessary.

15
00:01:23,620 --> 00:01:31,150
This group will still work without it but is just to make it fully compliant but is not necessary to

16
00:01:31,150 --> 00:01:37,360
attach the attribute to the opening script back on line 19 line 20.

17
00:01:37,360 --> 00:01:45,440
I have created a function called load and inside of inside the parenthesis here.

18
00:01:45,730 --> 00:01:50,010
That's all in parenthesis and that includes in online 23.

19
00:01:50,200 --> 00:01:56,290
I have defined a variable chord feed and I have passed the variable.

20
00:01:56,290 --> 00:02:07,840
I've set it to equal to the link you are real to the BBC website where I am picking up the IRS news

21
00:02:07,840 --> 00:02:08,740
feed from.

22
00:02:08,830 --> 00:02:11,200
So this is a link to the you are.

23
00:02:11,380 --> 00:02:15,920
Now the dynamic this feed here.

24
00:02:15,940 --> 00:02:23,540
You can have several You are rails attached or you know wherever you are LS Your like so far as to attach

25
00:02:23,590 --> 00:02:32,910
modern one just so you know separate whether a comma variable or takes once does one date.

26
00:02:32,950 --> 00:02:33,910
So far as I.

27
00:02:34,180 --> 00:02:40,100
I have tried several I probably will have to store them as an array.

28
00:02:41,130 --> 00:02:43,850
Ly 22.

29
00:02:44,180 --> 00:02:46,760
While I've done the line TD 22 they are.

30
00:02:46,810 --> 00:02:49,320
How did he call back.

31
00:02:49,360 --> 00:02:53,490
So I've added a new feed load core back.

32
00:02:53,510 --> 00:03:00,700
Don't forget we had a link here to be Ajax behere on line 10.

33
00:03:00,790 --> 00:03:01,860
Does the link there.

34
00:03:02,020 --> 00:03:03,990
So line 22 there.

35
00:03:04,000 --> 00:03:05,280
Actually what I've done here.

36
00:03:05,410 --> 00:03:16,120
I have created a new have added a new feed load core back so it would be a quad function and the actual

37
00:03:16,150 --> 00:03:28,540
dynamic the dynamic feed control takes either a single feed you are real okay or it can take in and

38
00:03:28,600 --> 00:03:30,750
agree or feed you are real.

39
00:03:31,000 --> 00:03:38,860
So this new this here the field the core back this would be the load core back up past it.

40
00:03:38,860 --> 00:03:51,070
This variable here quad feed right and it takes and also the few control here which is this divide the

41
00:03:51,280 --> 00:03:59,170
sub passed in to Param if us here first is a field which is is variable here that I define defined a

42
00:03:59,170 --> 00:04:05,390
variable down 21 code feed so I'm passing that variable code field a morsel passing it.

43
00:04:05,410 --> 00:04:13,400
This idae here cawfield quantrell so inside this idea is where what this will do it will take over this

44
00:04:13,450 --> 00:04:17,580
I.D. and inject the News Feed inside this idea.

45
00:04:17,590 --> 00:04:23,500
That's what that means are right on line 24.

46
00:04:23,500 --> 00:04:31,620
What I'm doing here I am actually loading so to load the actual Google feed API do that with a Google

47
00:04:31,660 --> 00:04:33,600
dot node module.

48
00:04:33,840 --> 00:04:44,350
Alright the module takes seem to Param if there's the first parameter is truly the model itself and

49
00:04:44,350 --> 00:04:46,710
then the next is the version.

50
00:04:46,900 --> 00:04:50,130
Okay so currently we've got version 1.

51
00:04:50,860 --> 00:04:53,970
Okay so this fits here refresh as reference.

52
00:04:53,980 --> 00:05:00,570
Is so late into the actual model we're using which is the field and the one here refers to the version.

53
00:05:00,790 --> 00:05:02,710
Ah right.

54
00:05:03,220 --> 00:05:11,500
Saw line 24 will be used to load the actual feed line 20.

55
00:05:11,750 --> 00:05:20,860
5 and a synchronoss call-back function so this function is a synchronous back to the google server to

56
00:05:20,890 --> 00:05:33,400
process the feed saw in 25 we process the feed when the page loads are rights or dassin dusts or these

57
00:05:33,400 --> 00:05:37,800
javascript when need to implement this feed.

58
00:05:37,800 --> 00:05:44,000
So just saved that are open on the web browser.

59
00:05:44,080 --> 00:05:52,160
I have also added some biz style in here to our Seer says file gives like one here I'm using the impot

60
00:05:52,840 --> 00:06:01,150
before if you want to use a certain type of stylin you need to import it so less well down here importing

61
00:06:01,150 --> 00:06:03,550
it from this location here.

62
00:06:03,610 --> 00:06:11,690
All right lane 3 basically I've got an idea called feed quantrell and this is what I've got a deep quality

63
00:06:11,890 --> 00:06:12,390
control.

64
00:06:12,410 --> 00:06:16,360
This is what I'm applying to the V to to that day.

65
00:06:16,720 --> 00:06:21,030
So I've got a margin there margin from the top 85 pixels.

66
00:06:21,070 --> 00:06:27,370
That means I want the margin to drop 2 to 5 pixels from the top.

67
00:06:27,370 --> 00:06:30,170
I want it to come down.

68
00:06:30,250 --> 00:06:38,170
So Line 5 of this year says basically what auto means marjane refers to the space outside the element

69
00:06:38,620 --> 00:06:41,350
while padding refers to this space inside.

70
00:06:41,350 --> 00:06:45,520
So margin means from the left and one little centre the div in all corners.

71
00:06:45,520 --> 00:06:47,340
Right so there are four corners.

72
00:06:47,350 --> 00:06:54,540
Top right bottom left lie 7 refers to do with how wide is going to be.

73
00:06:54,550 --> 00:06:56,070
The actual box.

74
00:06:56,080 --> 00:07:07,370
The div maybe 450 440 pixels the size of 25 pixels the size refers to the text.

75
00:07:07,900 --> 00:07:14,170
Again the colour colour refers to the colour of the text inside the border.

76
00:07:14,270 --> 00:07:16,390
Refers to the border around it.

77
00:07:16,390 --> 00:07:24,600
So I want the border to be blue padian refers to this space inside some saying padding from the top.

78
00:07:24,610 --> 00:07:28,860
I want you to move to the five pixels padding from the left.

79
00:07:28,930 --> 00:07:33,950
I want you to move from the left end to 5 pixels and then patter from the right and so on.

80
00:07:33,970 --> 00:07:41,170
So that's the CSF sons have applied to the content of the IRS news feed.

81
00:07:41,470 --> 00:07:48,490
So I'll say just saved that and then let's hear the feed and see what it looks like.

82
00:07:48,720 --> 00:07:53,840
So this is my direct re our click to launch it.

83
00:07:53,860 --> 00:07:57,010
Hopefully everything should be hunky dory.

84
00:07:57,040 --> 00:07:57,730
There we go.

85
00:07:57,730 --> 00:08:04,750
So we seem to have an active news feed so you can see the news feeds that are coming through at the

86
00:08:04,750 --> 00:08:06,030
moment.

87
00:08:06,130 --> 00:08:07,080
You can see it.

88
00:08:07,170 --> 00:08:14,500
It's cool it obsoletes any current information that's been added to the new that you can sell your tells

89
00:08:14,500 --> 00:08:19,810
you there three hours ago something was added and only keeps uploading and then if you're interested

90
00:08:19,810 --> 00:08:22,520
in reading more you just click on the link.

91
00:08:22,540 --> 00:08:29,560
Notice here that the content is being updated automatically have not had to go back to the BBC website

92
00:08:30,010 --> 00:08:33,110
to do something automatically effets true.

93
00:08:33,130 --> 00:08:35,310
That's why his call the feed.

94
00:08:35,470 --> 00:08:38,710
So it gives all the Obleas relating to defeat.

95
00:08:38,740 --> 00:08:46,590
I have specified it so the FT they have several feeds I have only specified the feed relation relating

96
00:08:46,600 --> 00:08:54,830
to World News So that's it for this project you can explore more and also create more fields that peak

97
00:08:54,830 --> 00:08:55,870
your interest.

98
00:08:55,870 --> 00:08:57,200
Thanks for watching.

99
00:08:57,260 --> 00:08:57,720
Oh.

100
00:08:57,730 --> 00:08:58,880
It's been useful.

101
00:08:58,880 --> 00:08:59,830
Bye for now.